<!--
 * @Description: 
 * @Author: shilinzhou
 * @Date: 2024-03-19 17:57:16
 * @LastEditors: James324
 * @LastEditTime: 2024-03-21 15:12:00
-->
<script setup lang="ts">
import { searchConfig } from './config/search-config.ts';
import { tableConfig } from './config/table-config.ts';
import detail from './dialogs/detail/index.vue';
import { doGetTaskList } from '@/api/plan/task/index';
import type { record } from '@/api/plan/task/model/type';

defineOptions({
    name: 'TaskList'
});

//  搜索相关
const tableRef = ref<TableRef>();
const searchRef = ref<SearchRef>();

// 工程排程明细
const detailRef = ref<InstanceType<typeof detail>>();
// 点击工程排程明细
const handleAction = (row: record) => {
    detailRef.value?.open(row);
};
</script>

<template>
    <q-page>
        <!-- 搜索框 -->
        <base-search ref="searchRef" :table-ref="tableRef" :search-config="searchConfig" />

        <!-- 表格 -->
        <base-table
            ref="tableRef"
            :getDataFn="doGetTaskList"
            :table-config="tableConfig"
            :hideDel="true"
            :closeEdit="true"
            :added-params="{ orderStatus: '生产中' }"
        >
            <!--订单状态显示 -->

            <template #orderStatus="{ row }: SlotData<record>">
                <q-status :type="row.orderStatus === '生产中' ? 'error' : 'info'">
                    {{ row.orderStatus }}
                </q-status>
            </template>
            <!-- 未排程数量 -->
            <template #unscheduledQuantity="{ row }">
                <span :style="{ color: row.unscheduledQuantity > 0 ? '#FC4848' : '#434343' }">
                    {{ row.unscheduledQuantity }}
                </span>
            </template>
            <!-- 排程明细 -->
            <template #action="{ row }">
                <el-link type="primary" @click="handleAction(row)"> 工序计划明细 </el-link>
            </template>
        </base-table>

        <!-- 工序计划明细详情 -->
        <detail ref="detailRef" />
    </q-page>
</template>

<style scoped lang="scss"></style>
